<template>
	<view class="">
		<view class="dis_flex ml24 mr30 h104">
			<view class="radius50 h64 dis_f" style="width: 610rpx;background-color: #F7F7F7">
				<u--input
					placeholder="请输入关键字"
					placeholderStyle="color:#999999"
					prefixIcon="search"
					border="none"
					prefixIconStyle="font-size: 22px;color: #D1D2D5;margin-left:30rpx"
				></u--input>
			</view>
			<view class="fz28 lh10 ml30">搜索</view>
		</view>
		<view class="h76 df jcsa jc fz26 tf_33 border_b4">
			<view class="dis_f" @click="filterTab">
				<text>综合排序</text>
				<image class="w16 ml12" style="height: 12rpx;" src="../../static/image/shaixuan.png" mode="aspectFit"></image>
			</view>
			<view class="dis_f">
				<text>筛选</text>
				<image class="w16 ml12" style="height: 12rpx;" src="../../static/image/shaixuan.png" mode="aspectFit"></image>
			</view>
		</view>
		<view class="pt30 ml30 mr30 border_b3 pb20" v-for="(item,index) in store_list" :key="index">
			<view class="df">
				<image class="w120 h120 radius8" :src="item.image" mode="aspectFill"></image>
				<view class="ml24 dfd_c jcsb" style="min-width: 546rpx; min-height:60rpx">
					<view class="fz28 tf_333">
						{{item.name}}
					</view>
					<view class="dis_flex w">
						<view class="fz34 fw tf1">
							¥{{item.price}}
						</view>
						<view class="fz24 tf_999">
							销量：{{item.sales_volume}}
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 弹出窗 -->
		<u-popup :show="popshow" mode="top" @close="accuratePopshow = false">
			<view class="">
				<view class="dis_flex pl24 pr24 h96 border_b3" v-for="(v,i) in tab_list" :key="index">
					<view class="fz28 tf_88">
						{{v}}
					</view>
					<image src="../../static/image/Rectangle_e.png" class="w36 h36" mode="aspectFill"></image>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import { storeRecomDetail } from '@/config/api.js';
export default {
	data() {
		return {
			page:'',
			popshow:false,
			store_list:[],
			tab_list:['综合排序','人气最高','价格高到低','价格低到高','销售排序']
		};
	},
	onLoad() {
		this.getStoreRecom()
	},
	methods: {
		getStoreRecom(){
			storeRecomDetail({page:this.page}).then(res => {
				console.log(res);
				this.store_list = res.list;
			});
		},
		filterTab(){
			this.popshow = true
		}
	}
};
</script>

<style>
page {
	background-color: #fff;
}
</style>
